<template>
  <div>
    <van-nav-bar
      style="color: #fff"
      title="修改密码"
      left-text=""
      left-arrow
      @click-left="onClickLeft"
    />

    <van-form validate-first @failed="onFailed">
      <!-- 通过 pattern 进行正则校验 -->

      <van-field
        left-icon="user-o"
        v-model="oldPassword"
        name="pattern"
        placeholder="请输入旧密码"
        :rules="[{ message: '请输入正确内容' }]"
      />
      <van-field
        left-icon="eye-o"
        v-model="newPassword"
        name="pattero"
        placeholder="请输入新密码"
        :rules="[{ message: '请输入正确内容' }]"
        ><template #button> </template
      ></van-field>
      <van-button
        round
        block
        type="info"
        native-type="submit"
        @click="verification"
        >更改</van-button
      >
    </van-form>
  </div>
</template>



<script>
export default {
  data() {
    return {
      oldPassword: "123456",
      newPassword: "",
      uid: "",
    };
  },
  mounted() {
    // this.oldusername = localStorage.getItem(oldusername);
    this.uid = localStorage.getItem("uid");
  },
  methods: {
    onClickLeft() {},
    onFailed() {},
    // 修改按钮
    async verification() {
      const { data: res } = await this.axios.post("/user/updatePwd", {
        oldPassword: this.oldPassword,
        newPassword: this.newPassword,
        uid: this.uid,
      });
      console.log(res);
      console.log(this.newPassword);
      window.localStorage.setItem(password, "this.newPassword");
    },
  },
};
</script>
<style lang="less" scoped>
.van-nav-bar__content {
  border: none;
}

.van-form {
  .van-field {
    .van-button {
      border-radius: 20px;
      background-color: #ededed;
      color: #000;
    }
  }
}
.van-nav-bar {
  background-color: #07c160;
}
.van-nav-bar {
  color: #fff;
}
.van-button {
  border: none;
  background-color: #07c160;
}
</style>